<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>地图应用</title>
    <style type="text/css">
#div1{
    width: 400px;
    height:400px;
    border:1px solid black;
}
    </style>
</head>
<body>

<input type="button" id="btn1" value="request"> 
<div id="div1"></div>

<script type="text/javascript" src="BDMap.js"></script>
<script>

window.onload = function(){
    var btn1 = document.getElementById("btn1");
    // var div1 = document.getElementById("div1"); 
    btn1.onclick = function(){

        // 创建Map实例
        var map = new BMap.Map("div1"); 
        // 伪造数据
        var pt = new BMap.Point(120, 30);

        // 初始化地图,设置中心点坐标和地图级别
        map.centerAndZoom(pt, 16);

        // 启用滚轮缩放，默认禁用
        map.enableScrollWheelZoom();

        // 创建标柱--默认
        // var marker1 = new BMap.Marker(pt);
        // map.addOverlay(marker1);

        // 创建标柱--自定义
        var myIcon = new BMap.Icon("../images/landMark.png", new BMap.Size(64, 64));
        var marker2 = new BMap.Marker(pt, {icon: myIcon});
        map.addOverlay(marker2);


        // 信息窗口
        var opts = {
            width: 200,
            height: 60,
            title: "tencent"    //信息窗口标题
        }
        var infoWindow = new BMap.InfoWindow("address: 应用宝，西园一路16号~~", opts);  //创建信息窗口对象
        map.openInfoWindow(infoWindow, pt);  //开启信息窗口



        navigator.geolocation.getCurrentPosition(function(position){

            console.log(position);
            var y = position.coords.longitude;
            var x = position.coords.latitude;
            var pt = new BMap.Point(y, x);
            // 把上面的代码放到这里来，看下真实的数据

        });
    }
}

</script>
</body>
</html>